<template>
    <div class="app-container">
        <div class="filter-container" ref="searchForm">
            <el-form :inline="true" :model="formData" class="search-form-inline" size="small">
                <el-form-item label="商品名称">
                    <el-input v-model="formData.goodsName"></el-input>
                </el-form-item>
                <el-form-item label="批准文号">
                    <el-input v-model="formData.approvalNumber"></el-input>
                </el-form-item>
                <el-form-item label="生产厂家">
                    <el-input v-model="formData.manufacturer"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="getList(1)">搜索</el-button>
                </el-form-item>
            </el-form>
            <div slot="header" class="clearfix">
                <el-button class="toolbar-btn" @click="sortTable()">排序</el-button>
                <!-- 新品和控销  -->
                <el-button
                    class="toolbar-btn"
                    @click="selectGoods()"
                    v-if="floorType==5||floorType==6"
                >选择商品</el-button>
            </div>
            <elTable ref="dataInfo" :enterSearch="true" :formData="formData" @tableData="getList">
                <el-table-column prop="goodsName" label="商品名称" align="center"></el-table-column>
                <el-table-column prop="manufacturer" label="生产厂家" align="center"></el-table-column>
                <el-table-column prop="productSpecification" label="规格" align="center"></el-table-column>
                <el-table-column prop="approvalNumber" label="批准文号" align="center"></el-table-column>
                <el-table-column prop="purchasePrice" label="采购价" align="center"></el-table-column>
                <el-table-column prop="purchasePrice" label="参考零售价" align="center"></el-table-column>
                <!-- 新品、控销 -->
                <el-table-column label="操作" align="center" v-if="floorType==5||floorType==6">
                    <template slot-scope="{row,$index}">
                        <el-button
                            type="primary"
                            size="mini"
                            @click="deletes(row)"
                            style="background:#e10202;border:1px solid #e10202"
                        >删除</el-button>
                    </template>
                </el-table-column>
            </elTable>
            <sortTable ref="sortTable"></sortTable>
            <dialogSelectGoods ref="dialogSelectGoods"></dialogSelectGoods>
        </div>
    </div>
</template>
<script>
import sortTable from "@/dialog/table/tableSort"; //表格排序框
import apisGoodsMessage from "@/api/shopDecoration/goodsMessage"; //商品管理列表接口
import elTable from "@/components/xForm/elTable";
import dialogSelectGoods from "./dialogSelectGoods"
export default {
    name: "goodsMessage",
    components: { sortTable, apisGoodsMessage, elTable,dialogSelectGoods },
    data() {
        return {
            formData: {
                goodsName: "",
                approvalNumber: "",
                manufacturer: "",
                currentPage: 1,
                pageSize: 10,
            },

            dataInfo: [],
            floorType: "", //楼层类型
        };
    },
    mounted() {
        this.floorType = this.$route.query.floorType; //获取楼层类型
        // this.dataInfo = this.$refs.dataInfo;
    },
    methods: {
        getList(pageNo) {
            let _this = this;
            _this.formData.currentPage = pageNo || _this.formData.currentPage;
            _this.formData.templateId = _this.$route.query.templateId;
            let dataInfo = [
                {
                    id: 1,
                    goodsName: "布洛芬缓释胶囊",
                    floorType: "1",
                },
            ];
            let total = 10;
            this.$nextTick(() => {
                this.$refs.dataInfo.loadData(dataInfo, total);
            });
            // apisGoodsMessage.goodsMessageList(this.formData).then(res=>{
            //     _this.dataInfo.loadData(res.data.list, res.data.total);
            // })
        },
        // 删除     
        deletes(row) {
            apisGoodsMessage.delete(this, row.id, (d) => {
                this.getList();
            });
        },
        // 排序
        sortTable() {
            this.dataInfo.sortTable({
                dataUrl: "/enterAreaGoodsMessage/list",
                sortUrl: "/enterAreaGoodsMessage/doSort",
                callback: () => {
                    this.getList();
                },
            });
        },
        // 选择商品 模板类型Id
        selectGoods() {
            this.$refs.dialogSelectGoods.open()
        },
    },
};
</script>

<style lang="" scoped>
</style>
